<ul class="ul-tree" id="catalog_tree">
    {% for item in data.videoOutline %}
    <li class="pointer">
        <a  href="javascript:void(0)"
            class="relative {% if item.videoInfoList.length>0 %} arrow-b {%endif%}"
            {% if item.videoInfoList.length>0 %}
            onclick="$(this).toggleClass('arrow-t').next().slideToggle()"
            {%endif%}>
            <span class="ove" style="max-width: 90%">{{loop.index}}、{{item.outlineName}}</span>
        </a>
        {% if item.videoInfoList.length>0 %}
        <ul class="ul-tree" rel='open'>
            {% for child in item.videoInfoList %}
            <li>
                <a {%if data.content%} class="link ove relative"
                   target="_blank" href='/{{child.id}}/video_play.html'
                   {%else%}
                   class="link ove relative {%if data.id==child.id%} hover {%endif%}"
                   data-href="/{{child.id}}/video_play.html" onclick="BASE.VIDEO_PLAY.videoJump.call(this)"
                   {%endif%}>
                    {%if data.id==child.id%}
                    <img class="vmiddle mr10" src="../../../public/images/icon_playing.gif" alt="video">
                    {%else%}
                    <img class="vmiddle mr10" src="../../../public/images/video_plag_blue_s.png" alt="video">
                    {%endif%}
                    ({{loop.index}})、{{child.name}}
                    {%if child.price==0 and child.gold==0%}
                    <span class="green">免费</span>
                    {%endif%}
                </a>
            </li>
            {% endfor %}
        </ul>
        {% endif %}
    </li>
    {% endfor %}
</ul>